<script setup>
import { fetchCityData } from "@/api/weatherAPI";
import { use } from "echarts/core";
import { ref } from "vue";
import { useCityStore } from "../stores/cityStore"
const city = ref('')//数据，用于页面与api中的联系
//获取store实例
const cityStore = useCityStore()


//调用根据城市名称获取数据的函数
function request(){

//console.log("city--------"+city.value)
getData(city.value);

}
//根据城市名获取城市数据
async function getData(cityName) {
  const res = await fetchCityData(cityName);
  console.log(res)
  console.log("更新状态前：")
  console.log(cityStore.location)
  cityStore.updateLocation(res.location[0])
    console.log("更新状态后：")
  console.log(cityStore.location)
}

</script>

<template>
    <div>
       <input type="search"  placeholder="请输入城市名称" v-model="city" @change="request()">
   </div>
</template>

<style scoped>
</style>
